import {observer} from "mobx-react";
import React from "react";
import {Alert, Form, message, Modal} from "antd";
import Store from "./Store";
import FormInput from "../../../components/form/FormInput";
import {createMenu} from "../../../api/work/GenerateApi";

@observer
class MenuForm extends React.Component {
    constructor(props) {
        super(props);
        this.state={}
    }

    handleSubmit = () => {
        this.props.form.validateFields((err, formData) => {
            if (!err){
                formData['pid'] = Store.pid;
                formData["sub_type"] = Store.subType;
                formData["type"] = 2;
                console.log(Store.subType,"sub");
                createMenu(formData).then(response => {
                    if (response.data.code === 200){
                        Store.flashMenu();
                        message.success(response.data.msg);
                        //关闭弹窗
                        Store.menuVisible = false;
                    }
                });
            }
        });
    };

    render() {
        return (
            <Modal
                title="创建菜单"
                width={800}
                visible={true}
                onOk={this.handleSubmit}
                onCancel={() => {Store.menuVisible = false}}
            >
                <Alert closable showIcon type={"info"} message={"小提示"}
                       style={{width: 500, margin: '0 auto 20px', color: '#31708f !important'}}
                       description={"填写以下表单添加页面生成的菜单,排序字段规则是:越小越靠前"}
                />
                <Form labelCol={{span: 6}} wrapperCol={{span: 14}}>
                    <FormInput form={this.props.form} label={"标题"} field={"title"} allowClear={true} placeholder={"请输入标题"} initialValue={""} rules={[{ required: true, message: '菜单标题不能为空' }]}/>
                    <FormInput form={this.props.form} label={Store.pid === 0 ? "模块" : "控制器"} field={"route"} allowClear={true} placeholder={Store.pid === 0 ? "请输入模块名" : "请输入控制器名"} initialValue={""} rules={[{ required: true, message: '字段不能为空' }]}/>
                    <FormInput form={this.props.form} label={"图标"} field={"icon"} allowClear={true} placeholder={"请输入图标"} initialValue={""}/>
                    <FormInput form={this.props.form} label={"排序"} field={"sort"} allowClear={true} placeholder={"请输入排序"} initialValue={1} rules={[{type:"number",message: '排序字段必须是数字'},{required: true, message: '排序字段不能不能为空'}]}/>
                </Form>
            </Modal>
        );
    }

}
export default Form.create()(MenuForm);
